function getTextCanvas(text: string): HTMLCanvasElement {
  const canvas: HTMLCanvasElement = document.createElement("canvas");
  const ctx = canvas.getContext("2d") as CanvasRenderingContext2D;
  const width = ctx.measureText(text).width + 20 *30, // 根据文字数量来决定宽度
    height = 30; //固定高度
  ctx.fillStyle = "#ffffff"; // 背景颜色
  ctx.fillRect(0, 0, width, height);
  ctx.font = 32 + 'px " bold';
  ctx.fillStyle = "red"; // 字体颜色
  ctx.textAlign = "center";
  ctx.textBaseline = "middle";
  ctx.fillText(text, width / 5, height / 2); // 实现边框
  ctx.moveTo(0, 0);
  ctx.lineTo(0, height);
  ctx.lineWidth = 2;
  ctx.strokeStyle = "yellow";
  ctx.stroke();
  ctx.moveTo(0, 0);
  ctx.lineTo(width, 0);
  ctx.lineWidth = 2;
  ctx.strokeStyle = "yellow";
  ctx.stroke();

  ctx.moveTo(width, height);
  ctx.lineTo(width, 0);
  ctx.lineWidth = 2;
  ctx.strokeStyle = "yellow";
  ctx.stroke();

  ctx.moveTo(width, height);
  ctx.lineTo(0, height);
  ctx.lineWidth = 2;
  ctx.strokeStyle = "yellow";
  ctx.stroke();
  ctx.scale(3,3)
  return canvas;
}
export {
    getTextCanvas
}